<template>
  <el-dialog
    :title="titleMap[mode]"
    v-model="visible"
    :width="700"
    destroy-on-close
    append-to-body
    @closed="emits('closed')"
  >
    <el-form
      :model="form"
      :rules="rules"
      ref="dialogForm"
      label-width="80px"
      :style="'el-dialog' === 'el-drawer' ? 'padding:0 20px' : ''"
    >

      <el-form-item label="用户头像" prop="avatar">
        <sc-upload v-model="form.avatar" title="选择用户头像" file-select />
      </el-form-item>

      <el-form-item label="用户账号" prop="account">
        <el-input v-model="form.account" clearable placeholder="请输入用户账号" />
      </el-form-item>

      <el-form-item label="用户密码" prop="pwd">
        <el-input v-model="form.pwd" clearable placeholder="请输入用户密码" />
      </el-form-item>

			<el-form-item label="手机号码" prop="phone">
				<el-input v-model="form.phone" clearable placeholder="请输入手机号码" />
			</el-form-item>

      <el-form-item label="真实姓名" prop="real_name">
        <el-input v-model="form.real_name" clearable placeholder="请输入真实姓名" />
      </el-form-item>

      <el-form-item label="生日" prop="birthday">
        <el-date-picker
          v-model="form.birthday" placeholder="请选择生日"
          type="datetime"
        />
      </el-form-item>

      <el-form-item label="身份证号码" prop="card_id">
        <el-input v-model="form.card_id" clearable placeholder="请输入身份证号码" />
      </el-form-item>

      <el-form-item label="用户备注" prop="mark">
        <el-input v-model="form.mark" clearable placeholder="请输入用户备注" />
      </el-form-item>

      <el-form-item label="用户昵称" prop="nickname">
        <el-input v-model="form.nickname" clearable placeholder="请输入用户昵称" />
      </el-form-item>

      <el-form-item label="添加时间" prop="add_time">
        <el-input v-model="form.add_time" clearable placeholder="请输入添加时间" />
      </el-form-item>

      <el-form-item label="用户余额" prop="now_money">
        <el-input v-model="form.now_money" clearable placeholder="请输入用户余额" />
      </el-form-item>

      <el-form-item label="佣金金额" prop="brokerage_price">
        <el-input v-model="form.brokerage_price" clearable placeholder="请输入佣金金额" />
      </el-form-item>

      <el-form-item label="用户剩余积分" prop="integral">
        <el-input v-model="form.integral" clearable placeholder="请输入用户剩余积分" />
      </el-form-item>

      <el-form-item label="会员经验" prop="exp">
        <el-input v-model="form.exp" clearable placeholder="请输入会员经验" />
      </el-form-item>

      <el-form-item label="连续签到天数" prop="sign_num">
        <el-input v-model="form.sign_num" clearable placeholder="请输入连续签到天数" />
      </el-form-item>

      <el-form-item label="分销等级" prop="agent_level">
        <el-input v-model="form.agent_level" clearable placeholder="请输入分销等级" />
      </el-form-item>

      <el-form-item label="是否有推广资格" prop="spread_open">
        <el-input v-model="form.spread_open" clearable placeholder="请输入是否有推广资格" />
      </el-form-item>

      <el-form-item label="推广员关联时间" prop="spread_time">
        <el-input v-model="form.spread_time" clearable placeholder="请输入推广员关联时间" />
      </el-form-item>

      <el-form-item label="详细地址" prop="address">
        <city-linkage v-model="form.address" valueType="name" />
      </el-form-item>

      <el-form-item label="用户类型，shop,erp,crm" prop="user_type">
        <el-select v-model="form.user_type" style="width:100%" clearable placeholder="请选择用户类型，shop,erp,crm">

          <el-option
            v-for="(item, index) in dictData.user_type"
            :key="index" :label="item.label"
            :value="item.value"
          >{{ item.label }}</el-option>

        </el-select>
      </el-form-item>

      <el-form-item label="事业部/代理/员工结束时间" prop="division_end_time">
        <el-input v-model="form.division_end_time" clearable placeholder="请输入事业部/代理/员工结束时间" />
      </el-form-item>

      <el-form-item label="代理商邀请码" prop="division_invite">
        <el-input v-model="form.division_invite" clearable placeholder="请输入代理商邀请码" />
      </el-form-item>

    </el-form>
    <template #footer>
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
    </template>
  </el-dialog>
</template>

<script setup>
  import { ref, reactive, defineExpose, onMounted,getCurrentInstance } from 'vue'
  import {useRouter} from "vue-router";
  import { ElMessage } from 'element-plus'
  import commonUser from '@/api/apis/common/commonUser'
  import systemDict from '@/api/apis/system/dataDict'
  import cityLinkage from '@/components/maCityLinkage'
  import threeLevelLinkage from '@/components/maCityLinkage/threeLevelLinkage'


  const emits = defineEmits(['success', 'closed'])
  const { proxy } = getCurrentInstance();
  const router = useRouter();

  const mode = ref('add')
  const treeList = ref([])
  const visible = ref(false)
  const isSaveing = ref(false)
  const dialogForm = ref(null)

  const titleMap = reactive({ add: '新增平台用户', edit: '编辑平台用户' })
  const dictData = reactive({
    user_type: [],

  })
  const form = reactive({
    id:'0',
avatar:'',
account:'',
pwd:'',
real_name:'',
birthday:null,
card_id:'',
mark:'',
nickname:'',
phone:'',
add_time:'0',
now_money:'0',
brokerage_price:'0',
integral:'0',
exp:'0',
sign_num:'0',
status:'0',
level:'0',
agent_level:'0',
spread_open:'0',
spread_uid:'0',
spread_time:'0',
is_promoter:'0',
address:[],
user_type:'0',
division_end_time:'0',
division_invite:'0',

  })
  const rules = reactive({
    account: [{required: true, message: '用户账号必填', trigger: 'blur' }],
    pwd: [{required: true, message: '用户密码必填', trigger: 'blur' }],
    // card_id: [{required: true, message: '身份证号码必填', trigger: 'blur' }],
    // mer_id: [{required: true, message: '商家id必填', trigger: 'blur' }],
    phone: [{required: true, message: '手机号码必填', trigger: 'blur' }],
    // now_money: [{required: true, message: '用户余额必填', trigger: 'blur' }],
    // brokerage_price: [{required: true, message: '佣金金额必填', trigger: 'blur' }],
    // user_type: [{required: true, message: '用户类型，shop,erp,crm必填', trigger: 'blur' }],

  })

  onMounted(async () => {
    await getDictData()
    if(router.currentRoute.value.query.open) {
    	open('add');
    }
  })

  const getDictData = () => {
    systemDict.getDict('user_type').then(res => {
      dictData.user_type = res.data
    })

  }

  const open = (type = 'add') => {
    mode.value = type
    visible.value = true

  }

  const submit = () => {
    dialogForm.value.validate(async (valid) => {
      if (valid) {
        isSaveing.value = true
        const res = mode.value === 'add' ? await commonUser.save(form) : await commonUser.update(form.id, form)
        if (res.success) {
          emits('success', form, mode.value)
          visible.value = false
          ElMessage.success(res.message)
        } else {
          ElMessage.error(res.message)
        }
        isSaveing.value = false
      }
    })
  }

  const setData = (data) => {
    for (let k in form) {
      if (data[k] || data[k] === 0) {
        form[k] = data[k]
      }
    }
  }


  defineExpose({
    open, setData
  })
</script>
